{
 "cells": [
  {
   "cell_type": "markdown",
   "metadata": {},
   "source": [
    "<!--BOOK_INFORMATION-->\n",
    "<a href=\"https://user-images.githubusercontent.com/19553554/71825144-2d568180-30d6-11ea-8ee0-63c849cfd934.png\" target=\"_blank\"><img align=\"left\" style=\"width: 76px; height: 100px; background: white; padding: 1px; border: 1px solid black; margin-right:10px;\"></a>\n",
    "*pyecharts 是一个用于生成 Echarts 图表的类库。Echarts 是百度开源的一个数据可视化 JS 库。用 Echarts 生成的图可视化效果非常棒，为了与 Python 进行对接，方便在 Python 中直接使用数据生成图，于是有人开发出了这个项目[GitHub](https://github.com/pyecharts/pyecharts) .*\n",
    "\n",
    "*Note.建议本程序在参看https://github.com/pyecharts/pyecharts 的安装步骤后再运行； 本程序所有的例子都是从官方提供的样例代码[GitHub](https://github.com/pyecharts/pyecharts-gallery)中提取的,如果对某个API有疑问建议在IDE里面查看*\n",
    "\n",
    "*Echart类型图种大全:https://echarts.apache.org/examples/zh/#chart-type-line pyecharts图导入到ppt中的方法:https://baijiahao.baidu.com/s?id=1663839456876951842&wfr=spider&for=pc.*\n",
    "\n",
    "*作者: LBQ; 时间:2020/7/24. 邮箱:779660843@qq.com*"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 2,
   "metadata": {},
   "outputs": [
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      "/home/fisadm/anaconda3/envs/detectron2/lib/python3.7/site-packages/pyecharts/charts/chart.py:14: PendingDeprecationWarning: pyecharts 所有图表类型将在 v1.9.0 版本开始强制使用 ChartItem 进行数据项配置 :)\n",
      "  super().__init__(init_opts=init_opts)\n"
     ]
    },
    {
     "data": {
      "text/html": [
       "\n",
       "<script>\n",
       "    require.config({\n",
       "        paths: {\n",
       "            'echarts':'https://assets.pyecharts.org/assets/echarts.min'\n",
       "        }\n",
       "    });\n",
       "</script>\n",
       "\n",
       "        <div id=\"6f9c29b7425c49ec9635870200b2e9e3\" style=\"width:900px; height:500px;\"></div>\n",
       "\n",
       "<script>\n",
       "        require(['echarts'], function(echarts) {\n",
       "                var chart_6f9c29b7425c49ec9635870200b2e9e3 = echarts.init(\n",
       "                    document.getElementById('6f9c29b7425c49ec9635870200b2e9e3'), 'white', {renderer: 'canvas'});\n",
       "                var option_6f9c29b7425c49ec9635870200b2e9e3 = {\n",
       "    \"animation\": true,\n",
       "    \"animationThreshold\": 2000,\n",
       "    \"animationDuration\": 1000,\n",
       "    \"animationEasing\": \"cubicOut\",\n",
       "    \"animationDelay\": 0,\n",
       "    \"animationDurationUpdate\": 300,\n",
       "    \"animationEasingUpdate\": \"cubicOut\",\n",
       "    \"animationDelayUpdate\": 0,\n",
       "    \"color\": [\n",
       "        \"#c23531\",\n",
       "        \"#2f4554\",\n",
       "        \"#61a0a8\",\n",
       "        \"#d48265\",\n",
       "        \"#749f83\",\n",
       "        \"#ca8622\",\n",
       "        \"#bda29a\",\n",
       "        \"#6e7074\",\n",
       "        \"#546570\",\n",
       "        \"#c4ccd3\",\n",
       "        \"#f05b72\",\n",
       "        \"#ef5b9c\",\n",
       "        \"#f47920\",\n",
       "        \"#905a3d\",\n",
       "        \"#fab27b\",\n",
       "        \"#2a5caa\",\n",
       "        \"#444693\",\n",
       "        \"#726930\",\n",
       "        \"#b2d235\",\n",
       "        \"#6d8346\",\n",
       "        \"#ac6767\",\n",
       "        \"#1d953f\",\n",
       "        \"#6950a1\",\n",
       "        \"#918597\"\n",
       "    ],\n",
       "    \"series\": [\n",
       "        {\n",
       "            \"type\": \"funnel\",\n",
       "            \"name\": \"\\u5546\\u54c1\",\n",
       "            \"data\": [\n",
       "                {\n",
       "                    \"name\": \"\\u54c8\\u58eb\\u5947\",\n",
       "                    \"value\": 91\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u8428\\u6469\\u8036\",\n",
       "                    \"value\": 56\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u6cf0\\u8fea\",\n",
       "                    \"value\": 99\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u91d1\\u6bdb\",\n",
       "                    \"value\": 57\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u7267\\u7f8a\\u72ac\",\n",
       "                    \"value\": 31\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u5409\\u5a03\\u5a03\",\n",
       "                    \"value\": 55\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u67ef\\u57fa\",\n",
       "                    \"value\": 108\n",
       "                }\n",
       "            ],\n",
       "            \"sort\": \"descending\",\n",
       "            \"gap\": 0,\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"margin\": 8\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"legend\": [\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"\\u91d1\\u6bdb\",\n",
       "                \"\\u6cf0\\u8fea\",\n",
       "                \"\\u5409\\u5a03\\u5a03\",\n",
       "                \"\\u7267\\u7f8a\\u72ac\",\n",
       "                \"\\u54c8\\u58eb\\u5947\",\n",
       "                \"\\u67ef\\u57fa\",\n",
       "                \"\\u8428\\u6469\\u8036\"\n",
       "            ],\n",
       "            \"selected\": {\n",
       "                \"\\u54c8\\u58eb\\u5947\": true,\n",
       "                \"\\u8428\\u6469\\u8036\": true,\n",
       "                \"\\u6cf0\\u8fea\": true,\n",
       "                \"\\u91d1\\u6bdb\": true,\n",
       "                \"\\u7267\\u7f8a\\u72ac\": true,\n",
       "                \"\\u5409\\u5a03\\u5a03\": true,\n",
       "                \"\\u67ef\\u57fa\": true\n",
       "            },\n",
       "            \"show\": true,\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        }\n",
       "    ],\n",
       "    \"tooltip\": {\n",
       "        \"show\": true,\n",
       "        \"trigger\": \"item\",\n",
       "        \"triggerOn\": \"mousemove|click\",\n",
       "        \"axisPointer\": {\n",
       "            \"type\": \"line\"\n",
       "        },\n",
       "        \"showContent\": true,\n",
       "        \"alwaysShowContent\": false,\n",
       "        \"showDelay\": 0,\n",
       "        \"hideDelay\": 100,\n",
       "        \"textStyle\": {\n",
       "            \"fontSize\": 14\n",
       "        },\n",
       "        \"borderWidth\": 0,\n",
       "        \"padding\": 5\n",
       "    },\n",
       "    \"title\": [\n",
       "        {\n",
       "            \"text\": \"Funnel-\\u57fa\\u672c\\u793a\\u4f8b\",\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10\n",
       "        }\n",
       "    ]\n",
       "};\n",
       "                chart_6f9c29b7425c49ec9635870200b2e9e3.setOption(option_6f9c29b7425c49ec9635870200b2e9e3);\n",
       "        });\n",
       "    </script>\n"
      ],
      "text/plain": [
       "<pyecharts.render.display.HTML at 0x7f00981d3a20>"
      ]
     },
     "execution_count": 2,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "from pyecharts import options as opts\n",
    "from pyecharts.charts import Funnel\n",
    "from pyecharts.faker import Faker\n",
    "\n",
    "c = (\n",
    "    Funnel()\n",
    "    .add(\"商品\", [list(z) for z in zip(Faker.choose(), Faker.values())])\n",
    "    .set_global_opts(title_opts=opts.TitleOpts(title=\"Funnel-基本示例\"))\n",
    "    #.render(\"funnel_base.html\")\n",
    ")\n",
    "c.load_javascript()\n",
    "c.render_notebook()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 4,
   "metadata": {},
   "outputs": [
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      "/home/fisadm/anaconda3/envs/detectron2/lib/python3.7/site-packages/pyecharts/charts/chart.py:14: PendingDeprecationWarning: pyecharts 所有图表类型将在 v1.9.0 版本开始强制使用 ChartItem 进行数据项配置 :)\n",
      "  super().__init__(init_opts=init_opts)\n"
     ]
    },
    {
     "data": {
      "text/html": [
       "\n",
       "<script>\n",
       "    require.config({\n",
       "        paths: {\n",
       "            'echarts':'https://assets.pyecharts.org/assets/echarts.min'\n",
       "        }\n",
       "    });\n",
       "</script>\n",
       "\n",
       "        <div id=\"361d857542e14ddea2fdea63ecace8d2\" style=\"width:900px; height:500px;\"></div>\n",
       "\n",
       "<script>\n",
       "        require(['echarts'], function(echarts) {\n",
       "                var chart_361d857542e14ddea2fdea63ecace8d2 = echarts.init(\n",
       "                    document.getElementById('361d857542e14ddea2fdea63ecace8d2'), 'white', {renderer: 'canvas'});\n",
       "                var option_361d857542e14ddea2fdea63ecace8d2 = {\n",
       "    \"animation\": true,\n",
       "    \"animationThreshold\": 2000,\n",
       "    \"animationDuration\": 1000,\n",
       "    \"animationEasing\": \"cubicOut\",\n",
       "    \"animationDelay\": 0,\n",
       "    \"animationDurationUpdate\": 300,\n",
       "    \"animationEasingUpdate\": \"cubicOut\",\n",
       "    \"animationDelayUpdate\": 0,\n",
       "    \"color\": [\n",
       "        \"#c23531\",\n",
       "        \"#2f4554\",\n",
       "        \"#61a0a8\",\n",
       "        \"#d48265\",\n",
       "        \"#749f83\",\n",
       "        \"#ca8622\",\n",
       "        \"#bda29a\",\n",
       "        \"#6e7074\",\n",
       "        \"#546570\",\n",
       "        \"#c4ccd3\",\n",
       "        \"#f05b72\",\n",
       "        \"#ef5b9c\",\n",
       "        \"#f47920\",\n",
       "        \"#905a3d\",\n",
       "        \"#fab27b\",\n",
       "        \"#2a5caa\",\n",
       "        \"#444693\",\n",
       "        \"#726930\",\n",
       "        \"#b2d235\",\n",
       "        \"#6d8346\",\n",
       "        \"#ac6767\",\n",
       "        \"#1d953f\",\n",
       "        \"#6950a1\",\n",
       "        \"#918597\"\n",
       "    ],\n",
       "    \"series\": [\n",
       "        {\n",
       "            \"type\": \"funnel\",\n",
       "            \"data\": [\n",
       "                {\n",
       "                    \"name\": \"\\u5c55\\u73b0\",\n",
       "                    \"value\": 100\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u70b9\\u51fb\",\n",
       "                    \"value\": 80\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u8bbf\\u95ee\",\n",
       "                    \"value\": 60\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u54a8\\u8be2\",\n",
       "                    \"value\": 40\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u8ba2\\u5355\",\n",
       "                    \"value\": 20\n",
       "                }\n",
       "            ],\n",
       "            \"sort\": \"descending\",\n",
       "            \"gap\": 2,\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"inside\",\n",
       "                \"margin\": 8\n",
       "            },\n",
       "            \"tooltip\": {\n",
       "                \"show\": true,\n",
       "                \"trigger\": \"item\",\n",
       "                \"triggerOn\": \"mousemove|click\",\n",
       "                \"axisPointer\": {\n",
       "                    \"type\": \"line\"\n",
       "                },\n",
       "                \"showContent\": true,\n",
       "                \"alwaysShowContent\": false,\n",
       "                \"showDelay\": 0,\n",
       "                \"hideDelay\": 100,\n",
       "                \"formatter\": \"{a} <br/>{b} : {c}%\",\n",
       "                \"textStyle\": {\n",
       "                    \"fontSize\": 14\n",
       "                },\n",
       "                \"borderWidth\": 0,\n",
       "                \"padding\": 5\n",
       "            },\n",
       "            \"itemStyle\": {\n",
       "                \"borderColor\": \"#fff\",\n",
       "                \"borderWidth\": 1\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"legend\": [\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"\\u5c55\\u73b0\",\n",
       "                \"\\u8ba2\\u5355\",\n",
       "                \"\\u54a8\\u8be2\",\n",
       "                \"\\u70b9\\u51fb\",\n",
       "                \"\\u8bbf\\u95ee\"\n",
       "            ],\n",
       "            \"selected\": {\n",
       "                \"\\u5c55\\u73b0\": true,\n",
       "                \"\\u70b9\\u51fb\": true,\n",
       "                \"\\u8bbf\\u95ee\": true,\n",
       "                \"\\u54a8\\u8be2\": true,\n",
       "                \"\\u8ba2\\u5355\": true\n",
       "            },\n",
       "            \"show\": true,\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        }\n",
       "    ],\n",
       "    \"tooltip\": {\n",
       "        \"show\": true,\n",
       "        \"trigger\": \"item\",\n",
       "        \"triggerOn\": \"mousemove|click\",\n",
       "        \"axisPointer\": {\n",
       "            \"type\": \"line\"\n",
       "        },\n",
       "        \"showContent\": true,\n",
       "        \"alwaysShowContent\": false,\n",
       "        \"showDelay\": 0,\n",
       "        \"hideDelay\": 100,\n",
       "        \"textStyle\": {\n",
       "            \"fontSize\": 14\n",
       "        },\n",
       "        \"borderWidth\": 0,\n",
       "        \"padding\": 5\n",
       "    },\n",
       "    \"title\": [\n",
       "        {\n",
       "            \"text\": \"\\u6f0f\\u6597\\u56fe\",\n",
       "            \"subtext\": \"\\u7eaf\\u5c5e\\u865a\\u6784\",\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10\n",
       "        }\n",
       "    ]\n",
       "};\n",
       "                chart_361d857542e14ddea2fdea63ecace8d2.setOption(option_361d857542e14ddea2fdea63ecace8d2);\n",
       "        });\n",
       "    </script>\n"
      ],
      "text/plain": [
       "<pyecharts.render.display.HTML at 0x7f00985cda90>"
      ]
     },
     "execution_count": 4,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "import pyecharts.options as opts\n",
    "from pyecharts.charts import Funnel\n",
    "\n",
    "\"\"\"\n",
    "Gallery 使用 pyecharts 1.1.0\n",
    "参考地址: https://echarts.baidu.com/examples/editor.html?c=funnel\n",
    "\n",
    "目前无法实现的功能:\n",
    "\n",
    "1、暂时无法对漏斗图的长宽等范围操作进行修改\n",
    "\"\"\"\n",
    "x_data = [\"展现\", \"点击\", \"访问\", \"咨询\", \"订单\"]\n",
    "y_data = [100, 80, 60, 40, 20]\n",
    "\n",
    "data = [[x_data[i], y_data[i]] for i in range(len(x_data))]\n",
    "\n",
    "fc = (\n",
    "    Funnel()\n",
    "    .add(\n",
    "        series_name=\"\",\n",
    "        data_pair=data,\n",
    "        gap=2,\n",
    "        tooltip_opts=opts.TooltipOpts(trigger=\"item\", formatter=\"{a} <br/>{b} : {c}%\"),\n",
    "        label_opts=opts.LabelOpts(is_show=True, position=\"inside\"),\n",
    "        itemstyle_opts=opts.ItemStyleOpts(border_color=\"#fff\", border_width=1),\n",
    "    )\n",
    "    .set_global_opts(title_opts=opts.TitleOpts(title=\"漏斗图\", subtitle=\"纯属虚构\"))\n",
    "    #.render(\"funnel_chart.html\")\n",
    ")\n",
    "fc.load_javascript()\n",
    "fc.render_notebook()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 5,
   "metadata": {},
   "outputs": [
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      "/home/fisadm/anaconda3/envs/detectron2/lib/python3.7/site-packages/pyecharts/charts/chart.py:14: PendingDeprecationWarning: pyecharts 所有图表类型将在 v1.9.0 版本开始强制使用 ChartItem 进行数据项配置 :)\n",
      "  super().__init__(init_opts=init_opts)\n"
     ]
    },
    {
     "data": {
      "text/html": [
       "\n",
       "<script>\n",
       "    require.config({\n",
       "        paths: {\n",
       "            'echarts':'https://assets.pyecharts.org/assets/echarts.min'\n",
       "        }\n",
       "    });\n",
       "</script>\n",
       "\n",
       "        <div id=\"8756dd8d216f410ea76d25a9725a2225\" style=\"width:900px; height:500px;\"></div>\n",
       "\n",
       "<script>\n",
       "        require(['echarts'], function(echarts) {\n",
       "                var chart_8756dd8d216f410ea76d25a9725a2225 = echarts.init(\n",
       "                    document.getElementById('8756dd8d216f410ea76d25a9725a2225'), 'white', {renderer: 'canvas'});\n",
       "                var option_8756dd8d216f410ea76d25a9725a2225 = {\n",
       "    \"animation\": true,\n",
       "    \"animationThreshold\": 2000,\n",
       "    \"animationDuration\": 1000,\n",
       "    \"animationEasing\": \"cubicOut\",\n",
       "    \"animationDelay\": 0,\n",
       "    \"animationDurationUpdate\": 300,\n",
       "    \"animationEasingUpdate\": \"cubicOut\",\n",
       "    \"animationDelayUpdate\": 0,\n",
       "    \"color\": [\n",
       "        \"#c23531\",\n",
       "        \"#2f4554\",\n",
       "        \"#61a0a8\",\n",
       "        \"#d48265\",\n",
       "        \"#749f83\",\n",
       "        \"#ca8622\",\n",
       "        \"#bda29a\",\n",
       "        \"#6e7074\",\n",
       "        \"#546570\",\n",
       "        \"#c4ccd3\",\n",
       "        \"#f05b72\",\n",
       "        \"#ef5b9c\",\n",
       "        \"#f47920\",\n",
       "        \"#905a3d\",\n",
       "        \"#fab27b\",\n",
       "        \"#2a5caa\",\n",
       "        \"#444693\",\n",
       "        \"#726930\",\n",
       "        \"#b2d235\",\n",
       "        \"#6d8346\",\n",
       "        \"#ac6767\",\n",
       "        \"#1d953f\",\n",
       "        \"#6950a1\",\n",
       "        \"#918597\"\n",
       "    ],\n",
       "    \"series\": [\n",
       "        {\n",
       "            \"type\": \"funnel\",\n",
       "            \"name\": \"\\u5546\\u54c1\",\n",
       "            \"data\": [\n",
       "                {\n",
       "                    \"name\": \"\\u6cb3\\u9a6c\",\n",
       "                    \"value\": 70\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u87d2\\u86c7\",\n",
       "                    \"value\": 71\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u8001\\u864e\",\n",
       "                    \"value\": 88\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u5927\\u8c61\",\n",
       "                    \"value\": 32\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u5154\\u5b50\",\n",
       "                    \"value\": 86\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u718a\\u732b\",\n",
       "                    \"value\": 138\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u72ee\\u5b50\",\n",
       "                    \"value\": 149\n",
       "                }\n",
       "            ],\n",
       "            \"sort\": \"descending\",\n",
       "            \"gap\": 0,\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"inside\",\n",
       "                \"margin\": 8\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"legend\": [\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"\\u718a\\u732b\",\n",
       "                \"\\u72ee\\u5b50\",\n",
       "                \"\\u6cb3\\u9a6c\",\n",
       "                \"\\u5927\\u8c61\",\n",
       "                \"\\u87d2\\u86c7\",\n",
       "                \"\\u5154\\u5b50\",\n",
       "                \"\\u8001\\u864e\"\n",
       "            ],\n",
       "            \"selected\": {\n",
       "                \"\\u6cb3\\u9a6c\": true,\n",
       "                \"\\u87d2\\u86c7\": true,\n",
       "                \"\\u8001\\u864e\": true,\n",
       "                \"\\u5927\\u8c61\": true,\n",
       "                \"\\u5154\\u5b50\": true,\n",
       "                \"\\u718a\\u732b\": true,\n",
       "                \"\\u72ee\\u5b50\": true\n",
       "            },\n",
       "            \"show\": true,\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        }\n",
       "    ],\n",
       "    \"tooltip\": {\n",
       "        \"show\": true,\n",
       "        \"trigger\": \"item\",\n",
       "        \"triggerOn\": \"mousemove|click\",\n",
       "        \"axisPointer\": {\n",
       "            \"type\": \"line\"\n",
       "        },\n",
       "        \"showContent\": true,\n",
       "        \"alwaysShowContent\": false,\n",
       "        \"showDelay\": 0,\n",
       "        \"hideDelay\": 100,\n",
       "        \"textStyle\": {\n",
       "            \"fontSize\": 14\n",
       "        },\n",
       "        \"borderWidth\": 0,\n",
       "        \"padding\": 5\n",
       "    },\n",
       "    \"title\": [\n",
       "        {\n",
       "            \"text\": \"Funnel-Label\\uff08inside)\",\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10\n",
       "        }\n",
       "    ]\n",
       "};\n",
       "                chart_8756dd8d216f410ea76d25a9725a2225.setOption(option_8756dd8d216f410ea76d25a9725a2225);\n",
       "        });\n",
       "    </script>\n"
      ],
      "text/plain": [
       "<pyecharts.render.display.HTML at 0x7f00984fb780>"
      ]
     },
     "execution_count": 5,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "from pyecharts import options as opts\n",
    "from pyecharts.charts import Funnel\n",
    "from pyecharts.faker import Faker\n",
    "\n",
    "\n",
    "fl = (\n",
    "    Funnel()\n",
    "    .add(\n",
    "        \"商品\",\n",
    "        [list(z) for z in zip(Faker.choose(), Faker.values())],\n",
    "        label_opts=opts.LabelOpts(position=\"inside\"),\n",
    "    )\n",
    "    .set_global_opts(title_opts=opts.TitleOpts(title=\"Funnel-Label（inside)\"))\n",
    "    #.render(\"funnel_label_inside.html\")\n",
    ")\n",
    "fl.load_javascript()\n",
    "fl.render_notebook()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 6,
   "metadata": {},
   "outputs": [
    {
     "name": "stderr",
     "output_type": "stream",
     "text": [
      "/home/fisadm/anaconda3/envs/detectron2/lib/python3.7/site-packages/pyecharts/charts/chart.py:14: PendingDeprecationWarning: pyecharts 所有图表类型将在 v1.9.0 版本开始强制使用 ChartItem 进行数据项配置 :)\n",
      "  super().__init__(init_opts=init_opts)\n"
     ]
    },
    {
     "data": {
      "text/html": [
       "\n",
       "<script>\n",
       "    require.config({\n",
       "        paths: {\n",
       "            'echarts':'https://assets.pyecharts.org/assets/echarts.min'\n",
       "        }\n",
       "    });\n",
       "</script>\n",
       "\n",
       "        <div id=\"177af75542eb41fdb958a93f204c0eeb\" style=\"width:900px; height:500px;\"></div>\n",
       "\n",
       "<script>\n",
       "        require(['echarts'], function(echarts) {\n",
       "                var chart_177af75542eb41fdb958a93f204c0eeb = echarts.init(\n",
       "                    document.getElementById('177af75542eb41fdb958a93f204c0eeb'), 'white', {renderer: 'canvas'});\n",
       "                var option_177af75542eb41fdb958a93f204c0eeb = {\n",
       "    \"animation\": true,\n",
       "    \"animationThreshold\": 2000,\n",
       "    \"animationDuration\": 1000,\n",
       "    \"animationEasing\": \"cubicOut\",\n",
       "    \"animationDelay\": 0,\n",
       "    \"animationDurationUpdate\": 300,\n",
       "    \"animationEasingUpdate\": \"cubicOut\",\n",
       "    \"animationDelayUpdate\": 0,\n",
       "    \"color\": [\n",
       "        \"#c23531\",\n",
       "        \"#2f4554\",\n",
       "        \"#61a0a8\",\n",
       "        \"#d48265\",\n",
       "        \"#749f83\",\n",
       "        \"#ca8622\",\n",
       "        \"#bda29a\",\n",
       "        \"#6e7074\",\n",
       "        \"#546570\",\n",
       "        \"#c4ccd3\",\n",
       "        \"#f05b72\",\n",
       "        \"#ef5b9c\",\n",
       "        \"#f47920\",\n",
       "        \"#905a3d\",\n",
       "        \"#fab27b\",\n",
       "        \"#2a5caa\",\n",
       "        \"#444693\",\n",
       "        \"#726930\",\n",
       "        \"#b2d235\",\n",
       "        \"#6d8346\",\n",
       "        \"#ac6767\",\n",
       "        \"#1d953f\",\n",
       "        \"#6950a1\",\n",
       "        \"#918597\"\n",
       "    ],\n",
       "    \"series\": [\n",
       "        {\n",
       "            \"type\": \"funnel\",\n",
       "            \"name\": \"\\u5546\\u54c1\",\n",
       "            \"data\": [\n",
       "                {\n",
       "                    \"name\": \"\\u6cb3\\u9a6c\",\n",
       "                    \"value\": 129\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u87d2\\u86c7\",\n",
       "                    \"value\": 28\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u8001\\u864e\",\n",
       "                    \"value\": 91\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u5927\\u8c61\",\n",
       "                    \"value\": 85\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u5154\\u5b50\",\n",
       "                    \"value\": 148\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u718a\\u732b\",\n",
       "                    \"value\": 73\n",
       "                },\n",
       "                {\n",
       "                    \"name\": \"\\u72ee\\u5b50\",\n",
       "                    \"value\": 114\n",
       "                }\n",
       "            ],\n",
       "            \"sort\": \"ascending\",\n",
       "            \"gap\": 0,\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"inside\",\n",
       "                \"margin\": 8\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"legend\": [\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"\\u718a\\u732b\",\n",
       "                \"\\u72ee\\u5b50\",\n",
       "                \"\\u6cb3\\u9a6c\",\n",
       "                \"\\u5927\\u8c61\",\n",
       "                \"\\u87d2\\u86c7\",\n",
       "                \"\\u5154\\u5b50\",\n",
       "                \"\\u8001\\u864e\"\n",
       "            ],\n",
       "            \"selected\": {\n",
       "                \"\\u6cb3\\u9a6c\": true,\n",
       "                \"\\u87d2\\u86c7\": true,\n",
       "                \"\\u8001\\u864e\": true,\n",
       "                \"\\u5927\\u8c61\": true,\n",
       "                \"\\u5154\\u5b50\": true,\n",
       "                \"\\u718a\\u732b\": true,\n",
       "                \"\\u72ee\\u5b50\": true\n",
       "            },\n",
       "            \"show\": true,\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        }\n",
       "    ],\n",
       "    \"tooltip\": {\n",
       "        \"show\": true,\n",
       "        \"trigger\": \"item\",\n",
       "        \"triggerOn\": \"mousemove|click\",\n",
       "        \"axisPointer\": {\n",
       "            \"type\": \"line\"\n",
       "        },\n",
       "        \"showContent\": true,\n",
       "        \"alwaysShowContent\": false,\n",
       "        \"showDelay\": 0,\n",
       "        \"hideDelay\": 100,\n",
       "        \"textStyle\": {\n",
       "            \"fontSize\": 14\n",
       "        },\n",
       "        \"borderWidth\": 0,\n",
       "        \"padding\": 5\n",
       "    },\n",
       "    \"title\": [\n",
       "        {\n",
       "            \"text\": \"Funnel-Sort\\uff08ascending\\uff09\",\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10\n",
       "        }\n",
       "    ]\n",
       "};\n",
       "                chart_177af75542eb41fdb958a93f204c0eeb.setOption(option_177af75542eb41fdb958a93f204c0eeb);\n",
       "        });\n",
       "    </script>\n"
      ],
      "text/plain": [
       "<pyecharts.render.display.HTML at 0x7f00981cea90>"
      ]
     },
     "execution_count": 6,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "from pyecharts import options as opts\n",
    "from pyecharts.charts import Funnel\n",
    "from pyecharts.faker import Faker\n",
    "\n",
    "fs = (\n",
    "    Funnel()\n",
    "    .add(\n",
    "        \"商品\",\n",
    "        [list(z) for z in zip(Faker.choose(), Faker.values())],\n",
    "        sort_=\"ascending\",\n",
    "        label_opts=opts.LabelOpts(position=\"inside\"),\n",
    "    )\n",
    "    .set_global_opts(title_opts=opts.TitleOpts(title=\"Funnel-Sort（ascending）\"))\n",
    "    #.render(\"funnel_sort_ascending.html\")\n",
    ")\n",
    "fs.load_javascript()\n",
    "fs.render_notebook()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "metadata": {},
   "outputs": [],
   "source": []
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.7.3"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 2
}
